﻿<common:LayoutAwarePage
    x:Name="pageRoot"
    x:Class="RCHelicopter.MainPage"
    DataContext="{Binding DefaultViewModel, RelativeSource={RelativeSource Self}}"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:RCHelicopter"
    xmlns:common="using:RCHelicopter.Common"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="LightGray">
        <Grid.RowDefinitions>
            <RowDefinition Height="150"></RowDefinition>
            <RowDefinition></RowDefinition>
        </Grid.RowDefinitions>
        <Grid Grid.Row="0">

            <StackPanel Orientation="Horizontal" HorizontalAlignment="Right">
                <Button Width="100" Height="100" BorderThickness="0" Click="buyButton_Click">
                    <Button.Background>
                        <ImageBrush ImageSource="Assets/Buy.png"/>
                    </Button.Background>
                </Button>
                <!--<Button Width="100" Height="100" BorderThickness="0">
                        <Button.Background>
                            <ImageBrush ImageSource="Assets/Help.png"/>
                        </Button.Background>
                    </Button>-->
            </StackPanel>
        </Grid>
        <Grid Grid.Row="1">
            <Grid.Background>
                <ImageBrush ImageSource="Assets/Background.png" Stretch="None" Opacity="0.5"/>
            </Grid.Background>

            <Grid Grid.Row="1" Margin="50">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="1*"/>
                    <ColumnDefinition Width="3*"/>
                    <ColumnDefinition Width="1*"/>
                </Grid.ColumnDefinitions>

                <StackPanel Grid.Column="1" VerticalAlignment="Bottom">

                    <Image x:Name="powerImage" Source="Assets/PowerOff.png" Width="150" Height="150" PointerPressed="powerImagePointerPressed"></Image>

                    <!--<ToggleButton x:Name="lightToggleButton" Width="150" Height="150" HorizontalAlignment="Center" BorderBrush="Transparent" Click="lightToggleButton_Click">
                        <ToggleButton.Background>
                            <ImageBrush ImageSource="Assets/LightOn.png"/>
                        </ToggleButton.Background>
                    </ToggleButton>

                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition></ColumnDefinition>
                            <ColumnDefinition></ColumnDefinition>
                        </Grid.ColumnDefinitions>
                        <Button Grid.Column="0" Width="150" Height="150" HorizontalAlignment="Center" BorderBrush="Transparent">
                            <Button.Background>
                                <ImageBrush Stretch="None" ImageSource="Assets/MisileLeft.png"/>
                            </Button.Background>
                        </Button>
                        <Button Grid.Column="1" Width="150" Height="150" HorizontalAlignment="Center" BorderBrush="Transparent">
                            <Button.Background>
                                <ImageBrush Stretch="None" ImageSource="Assets/MisileRight.png"/>
                            </Button.Background>
                        </Button>
                    </Grid>-->
                    <!--<Slider Value="0" Minimum="-10" Maximum="10" Width="400" Foreground="Blue" BorderBrush="Blue" Background="Blue"/>-->

                </StackPanel>

                <Canvas Width="300" Height="300" HorizontalAlignment="Center" VerticalAlignment="Bottom">
                    <Canvas.Background>
                        <ImageBrush Stretch="None" ImageSource="Assets/VerticalStickBase.png"/>
                    </Canvas.Background>

                    <Ellipse x:Name="leftStick" Width="100" Height="100" Canvas.Top="200" Canvas.Left="100" ManipulationDelta="leftStick_ManipulationDelta">
                        <Ellipse.Fill>
                            <ImageBrush Stretch="None" ImageSource="Assets/Stick.png"/>
                        </Ellipse.Fill>
                    </Ellipse>
                </Canvas>

                <Canvas Grid.Column="2" Width="300" Height="300" HorizontalAlignment="Center" VerticalAlignment="Bottom">
                    <Canvas.Background>
                        <ImageBrush Stretch="None" ImageSource="Assets/StickBase.png"/>
                    </Canvas.Background>

                    <Ellipse x:Name="rightStick" Width="100" Height="100" Canvas.Left="100" Canvas.Top="100" ManipulationDelta="rightStick_ManipulationDelta" ManipulationCompleted="rightStick_ManipulationCompleted">
                        <Ellipse.Fill>
                            <ImageBrush ImageSource="Assets/Stick.png" Stretch="None"/>
                        </Ellipse.Fill>
                    </Ellipse>
                </Canvas>
            </Grid>
        </Grid>


    </Grid>

    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="ApplicationViewStates">
            <VisualState x:Name="FullScreenLandscape"/>
            <VisualState x:Name="Filled"/>
            <VisualState x:Name="FullScreenPortrait"/>
            <VisualState x:Name="Snapped"/>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>

</common:LayoutAwarePage>
